import React from 'react';
import { Card, Typography, Table, Tag, Space, Divider } from 'antd';
import { TrophyOutlined, CrownOutlined, StarOutlined } from '@ant-design/icons';

const { Title, Text, Paragraph } = Typography;

const UserClassInfo: React.FC = () => {
  const userClassData = [
    {
      key: 1,
      level: 1,
      name: '普通用户',
      color: 'blue',
      maxDownloads: 3,
      dailyLimit: 5,
      speedLimit: '1MB/s',
      uploadWithoutReview: false,
      requirements: '新注册用户',
    },
    {
      key: 2,
      level: 2,
      name: '高级用户',
      color: 'green',
      maxDownloads: 5,
      dailyLimit: 50,
      speedLimit: '2MB/s',
      uploadWithoutReview: true,
      requirements: '上传量100GB，分享率1.5，注册30天',
    },
    {
      key: 3,
      level: 3,
      name: 'VIP用户',
      color: 'gold',
      maxDownloads: 10,
      dailyLimit: -1,
      speedLimit: '5MB/s',
      uploadWithoutReview: true,
      requirements: '上传量500GB，分享率2.0，注册90天',
    },
    {
      key: 4,
      level: 4,
      name: '管理员',
      color: 'red',
      maxDownloads: 999,
      dailyLimit: -1,
      speedLimit: '无限制',
      uploadWithoutReview: true,
      requirements: '由超级管理员任命',
    },
  ];

  const columns = [
    {
      title: '等级',
      dataIndex: 'level',
      key: 'level',
      width: 80,
      render: (level: number, record: any) => (
        <Tag color={record.color} icon={getIcon(level)}>
          {record.name}
        </Tag>
      ),
    },
    {
      title: '同时下载数',
      dataIndex: 'maxDownloads',
      key: 'maxDownloads',
      width: 120,
      render: (count: number) => count === 999 ? '无限制' : `${count}个`,
    },
    {
      title: '每日下载限制',
      dataIndex: 'dailyLimit',
      key: 'dailyLimit',
      width: 130,
      render: (limit: number) => limit === -1 ? '无限制' : `${limit}个`,
    },
    {
      title: '下载速度限制',
      dataIndex: 'speedLimit',
      key: 'speedLimit',
      width: 130,
    },
    {
      title: '免审核上传',
      dataIndex: 'uploadWithoutReview',
      key: 'uploadWithoutReview',
      width: 120,
      render: (allowed: boolean) => (
        <Tag color={allowed ? 'success' : 'default'}>
          {allowed ? '是' : '否'}
        </Tag>
      ),
    },
    {
      title: '升级要求',
      dataIndex: 'requirements',
      key: 'requirements',
      ellipsis: true,
    },
  ];

  const getIcon = (level: number) => {
    switch (level) {
      case 1: return <StarOutlined />;
      case 2: return <TrophyOutlined />;
      case 3: return <CrownOutlined />;
      case 4: return <CrownOutlined />;
      default: return null;
    }
  };

  return (
    <Card title={
      <Space>
        <TrophyOutlined style={{ color: '#faad14' }} />
        <Title level={4} style={{ margin: 0 }}>用户等级系统说明</Title>
      </Space>
    }>
      <Paragraph>
        用户等级系统根据用户的贡献和活跃度划分，不同等级享有不同的权限和特权：
      </Paragraph>
      
      <Divider />
      
      <Table
        columns={columns}
        dataSource={userClassData}
        pagination={false}
        size="small"
        bordered
      />
      
      <Divider />
      
      <Space direction="vertical" size="middle" style={{ width: '100%' }}>
        <div>
          <Title level={5}>等级特权说明：</Title>
          <ul>
            <li><Text strong>同时下载数：</Text>用户可以同时进行的下载任务数量</li>
            <li><Text strong>每日下载限制：</Text>每天最多可以下载的种子数量</li>
            <li><Text strong>下载速度限制：</Text>单个下载任务的最大速度限制</li>
            <li><Text strong>免审核上传：</Text>上传的种子是否需要管理员审核</li>
          </ul>
        </div>
        
        <div>
          <Title level={5}>升级机制：</Title>
          <ul>
            <li>系统会定期检查用户的上传量、分享率和注册时间</li>
            <li>满足条件的用户会自动升级到相应等级</li>
            <li>管理员也可以手动调整用户等级</li>
            <li>违规用户可能会被降级或禁用账户</li>
          </ul>
        </div>
        
        <div>
          <Title level={5}>注意事项：</Title>
          <Paragraph type="secondary">
            • 分享率 = 上传量 ÷ 下载量<br />
            • 新用户有30天的考核期，需要在考核期内达到基本要求<br />
            • 长期不活跃的用户可能会被系统清理<br />
            • 恶意刷分享率的行为将受到严厉处罚
          </Paragraph>
        </div>
      </Space>
    </Card>
  );
};

export default UserClassInfo; 